<template>
  <div class="page-employInvite">
    <div class="i-body">
      <div class="i-content">
        <div id="qrcode"></div>
        <!--  -->
      </div>
      <div class="i-info">
        <p>把当前页面二维码截图</p>
        <p>发送或分享给您的员工或好友</p>
        <p>员工或好友接受邀请成功后即刻使用
        </p>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      inviteCode: "",
      qrcode:
        "https://oimagea2.ydstatic.com/image?id=3614207173258557707&product=adpublish&w=300&h=250&sc=0&rm=0"
    };
  },
  mounted() {
    var self = this;
    console.log(window.location);
    // d定义请求
    var req = this.Axios.get(this.Interface.Graphql, {
      params: self.GetQuery()
    });

    // 执行请求
    req.then(res => {
      console.log(res);
      var data = res.data.data.me;
      if (data != null) {
        self.inviteCode = data.company.inviteCode;
        var host = self.GetInviteUrl();
        // var URL = `${host}?inviteCode=${data.company.inviteCode}`;
        var URL = `https://ysc.mmcai.cn/invite?inviteCode=${data.company
          .inviteCode}`;
        var qrcode = new QRCode(document.getElementById("qrcode"), {
          text: URL,
          width: 128,
          height: 128,
          colorDark: "#000000",
          colorLight: "#ffffff",
          correctLevel: QRCode.CorrectLevel.H
        });
      } else {
        var URL = `https://ysc.mmcai.cn/index`;
        var qrcode = new QRCode(document.getElementById("qrcode"), {
          text: URL,
          width: 128,
          height: 128,
          colorDark: "#000000",
          colorLight: "#ffffff",
          correctLevel: QRCode.CorrectLevel.H
        });
      }
    });
  },
  methods: {
    GetQuery() {
      return {
        query: `{
                me {
                  company{
                    inviteCode
                  }
                }
              }`
      };
    },
    GetInviteUrl() {
      var locals = window.location;
      var host = locals.host;
      var path = locals.pathname;
      return `https://${host}${path}#/addEmploy`;
    }
  }
};
</script>

<style lang="less" scoped>
.page-employInvite {
  position: relative;
  width: 100%;
  height: 100%;
  background: #f3f3f3;
  .i-body {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    & > div {
      -webkit-box-flex: 1;
      box-sizing: border-box;
      padding: 0 0 100px 0;
      &.i-content {
        box-sizing: border-box;
        display: -webkit-box;
        -webkit-box-align: end;
        -webkit-box-pack: center;

        img {
          display: block;
          width: 200px;
          height: 200px;
        }
      }
      &.i-info {
        text-align: center;
        line-height: 50px;
        color:#000000;
        font-size: 28px;
      }
    }
  }
}
</style>



